﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.cs" MasterPageFile="MasterPage.Master" Inherits="Web.Pages.Login" %>

<asp:Content ID="mainContent" ContentPlaceHolderID="MainContent" runat="Server" >

    <!-- Styles -->
    <style type="text/css" >
        #container
        {
            margin: 0 auto;
	        width: 35%;
        }
        #logoPanel
        {
            width: 100%;
            overflow: hidden;      
	        margin-top: 30px;
	        margin-bottom: 30px;                  
        }
        #pnlLogin
        {	        
            /*width: 450px;*/
            font-family: 'Molengo',Helvetica,sans-serif;
	        font-size: 14px;
	        background: #fff;
	        border-radius: 3px;
	        border: 1px solid #ccc;
	        box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
	        background: #f0f0f0;
        }
        #pnlInput
        {
            padding: 15px;
        }
        #pnlAction
        {
	        background: #ecf2f5;
	        width: 100%;
            height: 100%;
	        box-shadow: inset 0 1px 1px #fff;
	        border-top: 1px solid #ccc;
	        border-bottom-right-radius: 3px;
	        border-bottom-left-radius: 3px;

            padding-top: 15px;
            padding-bottom: 15px;
        }
        #pnlPasswordRecovery
        {
            display: none;
            box-shadow: inset 0 1px 1px #fff;
            border-top: 1px solid #ccc;            
        }

        #pnlAction table,
        #pnlPasswordRecovery table
        {
            padding-right: 10px;
            padding-left: 20px;            
        }

        label
        {
	        color: #555;
        }
        a
        {
	        color: #aaa;
	        text-decoration: none;
        }
        a:hover
        {
	        color: #555;
	        text-decoration: underline;
        }
        input[type=text],
        input[type=password]
        {
            font-size: 14px;
            text-indent: 5px;
	        color: #777;
	        width: 100%;
	        height: 35px;
	        margin-top: 10px;
	        margin-bottom: 10px;
	        border: 1px solid #c7d0d2;
	        border-radius: 2px;
	        box-shadow: inset 0 1.5px 3px rgba(190, 190, 190, .4), 0 0 0 5px #f5f7f8;
        }
        input[type=text]:hover,
        input[type=password]:hover
        {
	        border: 1px solid #b6bfc0;
	        box-shadow: inset 0 1.5px 3px rgba(190, 190, 190, .7), 0 0 0 5px #f5f7f8;
        }
        input[type=text]:focus,
        input[type=password]:focus
        {
	        border: 1px solid #a8c9e4;
	        box-shadow: inset 0 1.5px 3px rgba(190, 190, 190, .4), 0 0 0 5px #e6f2f9;
        }
        
        /* Checkbox */
        input[type=checkbox]
        {
	        margin-left: 20px;
	        margin-top: 30px;
        }
        .check
        {
            cursor: pointer;
	        margin-left: 3px;
	        color: #444;
	        text-shadow: 0 1px 0 #fff;
        }        
        #lblLogin_Status,
        #lblPasswordRecovery_Status
        {
            width: 100%;
            height: 20px;
            float: left;
            padding-top: 5px;
            padding-bottom: 5px;
            text-indent: 5px;
            border: 1px solid transparent;
        }
        #dialogBienvenidaProveedor label
        {
            font-weight: bold;
            font-size: 14px;
        }        
    </style>

    <!--$(document).ready-->  
    <script type="text/javascript" >

        var _usuarioInfo = null;

        var controles = { General: {}, Dialogos: { Bienvenida: {} } };
        /* General */
        controles.General.btnEntrar                 = "btnEntrar";
        controles.General.NombreUsuario             = "txtLogin_NombreUsuario";
        controles.General.Password                  = "txtLogin_Password";
        controles.General.Status                    = "lblLogin_Status";
        controles.General.RecuperarPassword =
        {
            Panel: "pnlPasswordRecovery",
            Link: "lnkRecuperarPassword",
            Email: "txtPasswordRecovery_Email",
            Boton: "btnPasswordRecovery_Enviar",
            Status: "lblPasswordRecovery_Status"
        };
        /* Dialogos */
        controles.Dialogos.Bienvenida.Id            = "dialogBienvenidaUsuario";
        controles.Dialogos.Bienvenida.Title         = "Bienvenido/a";
        controles.Dialogos.Bienvenida.Saludo        = "lblDialogBienvenidaUsuario_Saludo";
        controles.Dialogos.Bienvenida.btnAceptar    = "btnAceptarBienvenida";

        $(document).ready(function ()
        {
            procesarParametros();
            cargarPagina_Login();
        });
        function procesarParametros()
        {
            Framework.Page.Parameters.parseQueryString();
        }
        function cargarPagina_Login()
        {
            Site.Page.setTitle("Control de Proveedores");

            //$("#{0}, #{1}".format(controles.General.NombreUsuario, controles.General.Password)).keydown(function(event)
            $("#container").keydown(function (event) {
                if (event.which == 13)
                    abrirSesion();
            });
            $("#{0}".format(controles.General.btnEntrar)).click(function () { abrirSesion(); });
            $("#{0}".format(controles.Dialogos.Bienvenida.btnAceptar)).click(function () { aceptarBienvenida(); });

            $("#" + controles.General.RecuperarPassword.Link).click(function() { $("#" + controles.General.RecuperarPassword.Panel).slideToggle();  });


            $("#{0}".format(controles.General.RecuperarPassword.Boton)).click(function() { enviarMailRecuperacionPassword(); });
        }
        function abrirSesion()
        {
            displayMessage(controles.General.Status, _notifications.info, "Validando datos..", true);

            var parametros =
            {
                nombreUsuario   : $("#{0}".format(controles.General.NombreUsuario)).val(),
                password        : $("#{0}".format(controles.General.Password)).val()
            }

            Helpers.AJAXHelper.invoke("abrirSesion", JSON.stringify(parametros), abrirSesion_Respuesta);
        }
        function abrirSesion_Respuesta(datos)
        {
            var respuesta = jQuery.parseJSON(datos.d);
            if ( respuesta.Resultado )
            {
                displayMessage(controles.General.Status, _notifications.success, "Iniciando sesión..");
                var usuarioInfo = respuesta.Valor;
                _usuarioInfo = usuarioInfo;
                if ( !validarPermisosAdmin(usuarioInfo.IdTipo) )
                    mostrarMensajeBienvenidaUsuario( usuarioInfo );
                else
                    cargarPaginaInicial( usuarioInfo.IdTipo, usuarioInfo.IdCategoria );
            }
            else
            {
                displayMessage(controles.General.Status, _notifications.error, respuesta.Mensaje);
            }
        }
        function mostrarMensajeBienvenidaUsuario(usuarioInfo)
        {
            var horario = Helpers.DateTimeHelper.GetCurrentTime().split(':');
            var hora = parseInt( horario[0] );
            var tiempo = "";
            if ( hora >= 0 && hora < 6 )
                tiempo = "Buenas noches";
            if ( hora >= 6 && hora < 13 )
                tiempo = "Buen día";
            if ( hora >= 13 && hora < 20 )
                tiempo = "Buenas tardes";
            if ( hora >= 20 && hora <= 24 )
                tiempo = "Buenas noches";

            var saludo = tiempo + " " + usuarioInfo.Nombre + " " + usuarioInfo.Apellido;
            $("#{0}".format(controles.Dialogos.Bienvenida.Saludo)).text(saludo);

            var dialogBienvenidaOpts =
            {
                title:  controles.Dialogos.Bienvenida.Title.toUpperCase(),
                width:  400,
                height: 100,
                close: aceptarBienvenida
            };
            Helpers.DialogHelper.initializeDialog( controles.Dialogos.Bienvenida.Id, dialogBienvenidaOpts );
            Helpers.DialogHelper.openDialog( controles.Dialogos.Bienvenida.Id );
        }
        function aceptarBienvenida()
        {
            cargarPaginaInicial( _usuarioInfo.IdTipo, _usuarioInfo.IdCategoria );
        }
        function enviarMailRecuperacionPassword()
        {
            var email = $("#{0}".format(controles.General.RecuperarPassword.Email)).val();
            if (email.length == 0)
            {
                displayMessage(controles.General.Status, _notifications.error, "Formato de email inválido", false);
                return false;
            }

            displayMessage(controles.General.Status, _notifications.info, "Validando casilla de email..", true);
            var parametros =
            {
                email: email
            }
            Helpers.AJAXHelper.invoke("enviarMailRecuperacionPassword", JSON.stringify(parametros), enviarMailRecuperacionPassword_Respuesta);
        }
        function enviarMailRecuperacionPassword_Respuesta(datos)
        {
            var respuesta = jQuery.parseJSON(datos.d);
            if ( respuesta.Resultado )
            {
                mostrarNotificacion(_notifications.success, respuesta.Mensaje, false);
                destroyMessage(controles.General.Status);
                $("#" + controles.General.RecuperarPassword.Panel).slideToggle();
            }
            else
            {
                displayMessage(controles.General.Status, _notifications.error, respuesta.Mensaje);
            }
        }
    </script>

    <!--HTML-->

    <div id="container" >
        
        <div id="logoPanel" >
            <!--
            <div id="appLogo" >
                <img src="Images/logo.png" alt="Sistema de Gestión de Guiones Online" />
            </div>
            <label id="appTitle" >Sistema de Gestión de Guiones</label>
            -->
            <table border="0" cellpadding="0" cellspacing="0" width="100%" >
                <colgroup>
                    <col width="100%" />
                </colgroup>
                <tr>
                    <td align="center" >
                        <img src="Images/logo.png" alt="Sistema de Gestión de Guiones Online" />
                    </td>
                </tr>
            </table>
        </div>

        <div id="pnlLogin" >

            <div id="pnlInput" >
                
                <table border="0" cellpadding="0" cellspacing="0" width="100%" >
                    <colgroup>
                        <col width="100%" />
                    </colgroup>
                    <tr>
                        <td>
                            <label style="width:100%" >Nombre de usuario:</label>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <input type="text" id="txtLogin_NombreUsuario" tabindex="1" placeholder=" Ingrese Nombre de Usuario " value="" />
                        </td>
                    </tr>
                    <tr>
                        <td>
                             <label style="width:100%" >Contraseña:</label>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <input type="password" id="txtLogin_Password" tabindex="2" placeholder=" Ingrese Password " value="" />
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <label id="lblLogin_Status" ></label>
                        </td>
                    </tr>
                </table>

            </div>
                
            <div id="pnlPasswordRecovery" >
                <table border="0" cellpadding="0" cellspacing="0" width="100%" >
                    <colgroup>
                        <col width="70%" />
                        <col width="30%" />
                    </colgroup>
                    <tr>
                        <td colspan="2">
                            <br/>
                            <label>El sistema enviará un mail a la dirección indicada abajo con el password asociado a esa cuenta:</label>
                        </td>
                    </tr>
                    <tr>
                        <td align="left">
                            <input id="txtPasswordRecovery_Email" type="text" placeholder=" Ingrese casilla de email" />
                        </td>
                        <td align="right" >
                            <div id="btnPasswordRecovery_Enviar" class="boton redondo" >
                                <img src="Images/16x16/mail.png" alt="Entrar" />&nbsp;Enviar
                            </div>                              
                        </td>
                    </tr>
<%--                    <tr>
                        <td colspan="2" >
                            <label id="lblPasswordRecovery_Status" >No existe un usuario con esa casilla de email</label>
                        </td>
                    </tr>--%>
                </table>                
            </div>
            <div id="pnlAction" >
                <table border="0" cellpadding="0" cellspacing="0" width="100%" >
                    <colgroup>
                        <col width="70%" />
                        <col width="30%" />
                    </colgroup>
                    <tr>
                        <td align="left">
                            <a id="lnkRecuperarPassword" href="javascript:void(0);" >Recuperar contraseña</a>
                        </td>
                        <td align="right" >
                            <div id="btnEntrar" class="boton redondo" >
                                <img src="Images/16x16/llave.png" alt="Entrar" />&nbsp;Entrar
                            </div>                                
                        </td>
                    </tr>
                </table>
            </div>

        </div>

        <br />

        <!-- Diálogo Bienvenida -->
        <div id="dialogBienvenidaUsuario" style="display:none" >
            <table border="0" cellpadding="0" cellspacing="0" width="100%" >
                <colgroup>
                    <col width="75%" />
                    <col width="25%" />
                </colgroup>
                <tr>
                    <td>
                        <label id="lblDialogBienvenidaUsuario_Saludo" ></label>
                    </td>
                    <td>
                        <div style="float:right" >
                            <div id="btnAceptarBienvenida" class="botonAccion" >
                                <img src="Images/16x16/valido.png" alt="Aceptar" />
                                <label>Aceptar</label>
                            </div>
                        </div>
                    </td>
                </tr>
            </table>
        </div>
        
    </div>

</asp:Content>